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In the Previous lessons, we know the main stages to create a website. One of 
the main stages to create a website is the execution stage, when the paper design 
becomes a web page in which all data, texts, images, videos, sound files are input. 
This happens according to the design stage for each web page and creating 
hyperlinks between the pages using a programming language. 

- In this lesson, we will know in details how to use HTML to create a web 
page.Then, we will see in detail how to create web site. 



Website pages.",^^ " Diagram of 
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HTML: 

-It is a coding language used to create internet pages which are used through an 
internet browser. 

HTML codes: 

To create a web page, HTML codes are used, these codes are called Tags. An 
internet browser executes these tags on the browser page. 


To create a web page using HTML tags, do as follows: 

- Create a text file using a text editor to write and edit the HTML tags. 

- Write the HTML tags between these signs "<" " >". 

- Write most of the tags with a start " < >" and an end " </>". 

- Save the text file with the HTML tags with.htm or .html extension 

- Open the saved file using a web browser and notice the result. 

- Write HTML tags in capital or small letters. 
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The Structure of creating a web page using HTML 


Activity (1) 


Cooperating with your classmates and with the help of the teacher, identify 
the structure of creating a web page using HTML tags. 

Steps to follow: 

-Upload a text editor program 

- Write the tag <html> at the beginning of the code to refer that the document is written 
in HTML. 

-The HTML tag is divided into two parts: 




1- head the part where the page information is written for the browser like page title. 

2- body: the part where the content is written 
So the structure of the tag file is as follows 


Writing the structure to create a web 
page by using HTML in text editor 


<html> 

<head> 


</head> 

<body> 


</body> 

</html> 



he Structure of a web page created by HTML 


<html> 

<head> 


</head> 


</html> 
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In the structure to create a web 


Page using HTML tags, take care of the following: 


- Type <html> at the beginning of the tags to refer that the document is written in 
.html 

-The HTML tag is divided into two parts: 

1- lead the part where the page information is typed for the browser. 

2- the part where the content is written. 



Add a web page title using </title> <title> tag 

Activity (2) 

Exercise: 

Cooperating with your classmates and with the help of the teacher, the students 
search the internet to find a Web page title and content. 



The web page consists of a TITLE and CONTENT, the title appears in the address 
bar at the top of the page. 


84 


Computer Information Technology And Communication 


Ministry of Education 



To add the text as a title to the web page, students with the help of the 

teacher do the following: 

- Start a text editor program. 

- Type the structure to create the page using HTML tags. 

- Type the tag <title> </title> in the field <head >...</head 




Ml P’C 




<html> 

<head> 


<title> </title> 


Open the file school.htm (web 
page) using a web browser. 


</head> 

<body> 


</body> 

</html> 

Write the tag in a text editor 

program. 




Save the file with the name school.htm 

- Open the file school.htm (the web page) using a web browser to see the result of 
executing the typed tags. 
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Adding a content to a web page (text-image-video- hyperlink...) 


The web page can include text, image, video and hyperlinks 


First: Adding a text to the web page: 

To add a text " SjjkL»j to the content of the web page. 



Cooperating with your classmates and with the help of the teacher, do the 
following: 

- In the previous text file, we type the phrase " "inside 

the <body>...</body> tag. 

- Save the text file with the same title "school.htm" 

- Open the file "school. htnV'using the internet explorer to see the outcome of the 
tags you have typed. 


FMfcJti 



<html> 

<head> 

<title> </title> 

</head> 

<body> 

5 J J l ^ 1 ? 1 j ^ 1 1 J qjk^l 


</body> 

</html> 


Opening the web page by the 
tfe rnet e xp l or e r 


T> !-■■■: 
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Practice 



Using the previous practice and with the help of the teacher, students do the 
following: 

- Type the HTML tags for the previous practice using capital letters. 

- Leave spaces between the words of the text. 

- Use the enter key to leave lines between the words of the text. 

- Save the text file with .htm extension. 

- Display the file using the internet explorer. 


Important Notes: 

- You can write the HTML tags with Capital letters or Small letters. 

- The internet explorer isn't affected by the left spaces in the file 
or by moving to a new line by pressing the enter key. 



Changing the direction of the web page using "dir" 


property 


When designing a web page with Arabic view, we have to change the 
direction of the page to make the content from right to left to suit the Arabic 
language and to execute this, we use the property "dir", where we specify the 
direction of the web page according to the value of the property dir as in the 
following table. 


Value 

Effect 

Rtl 

From right to left 

Ltr 

From left to right 
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Cooperating with your classmates and with the help of the teacher, use the 
previous practice to change the direction of the content of the web page from 
right to left as follows: 

-Editing the code by adding the dir to the <body> tag. 

- Assign the value rtl to dir property to change the direction <body> to be <body 
dir="rtl"> 

- Save the text file. 

- Open the web page file by the internet explore to appear as follows: 
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Practice 


Cooperating with your classmates and with the help of the teacher , make a 
comparison between the effect of the value "rtl" and the value "Itr" to dir 
property on the direction of the web page content. 





The direction of the content The direction of , he content 

from left to right from rjaht t0 |eft 

( A comparison that shows the effect of the values of dir property) 


Web page formatting 


There are many formats which can be applied to the content of the web page 
to look more attractive. Some of them are applied on the text of the web page 
and some of them are applied on the background of the web page: 

• formatting the text includes many processes, from them 
o Type the beginning from a new line 
o Text alignment 
o Putting spaces between words 
o Formatting the font (face, volume, cooler, style) 


• Formatting the web pages includes: 

o Changing the cooler of the web page background, 
o Putting an image as a background web page. 
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Firstly : formatting the text in the web page: 


1-Writing at the beginning of a new line by <br> tag. 


i 


To display the text in the web page in two lines, we use the <br> tag where we 
use this tag to start writing in a new line, we use the <br> tag. 


tt 


£ 

Activity (5) 


Cooperating with your classmates and with the help of the teacher, do the 
following: 

- Open the previous text file. 

- Add the tag <br> and add the text "Name: 

Mohamed Khaled" 

- Save the text file with the .htm extension. 

- Open the file in the internet explorer. 


<html> 

<head> 

<title> </title> 

</head> 


Noticing the text content appears on two lines 


<body dir="rtl"> 
<br> 



'ici-xp ; 

</body> 

</html> 


Writing the code in the text 
editor 


The web page by the internet 
explorer after executing the code 
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/"Formatting the text in the web page 


2- Centering the text by <center>... </center> tag. 


To put a text in the middle of the line, we use <center> tag . 


Activity (6) 


Cooperating with your classmates and with the help of the teacher: 

Open the previous text file. 

Add the <center> school location </center> . 

Save the text file with the htmextension. 

Open the file in the internet explorer. 

Noticing that the phrase "School location"appears in the middle of the line. 


<html> 

<head> 

<title> </title> 
</head> 

<body dir= M rtl M > 


F:\nnywork\l\HTML\T p - 6 



in} ^ ® 1 




1 

jlS i4i4 1 


<center> gsjo </center> 


The web page after executing 
the code 

Formatting the text in the web page 


<br> 

jJU icM ; pdn’Jll 

</body> 

</html> 


Typing the code in 
the text editor 
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3- Add blank space between words by &nbsp 


When leaving any number of spaces between words in the file, the explorer 
will deal with it when viewing the page as one space. To control the number of 
spaces between words, we use the symbol &nbsp. We repeat it according to the 
number of the needed spaces between words. 



Cooperating with your classmates and with the help of the teacher: 

- Open the previous text file. 

- Writing the code site &nbsp; &nbsp; &nbsp, &nbsp; the school 

- Save the text file with the .htm extension. 


- Open the file in the internet explorer. 
Noticing the phrase "School Website" 
and putting four spaces between the 
two words as in the following diagram: 





<html> 

<head> 

<title> </title> 

</head> 

<body dir= rtl > 

<center> 

j£>4&nbsp; &nbsp; &nbsp; &nbsp; 

fl/eemep 

<br> 


The web page after executing 
the code 



</body> 

</htmI> 


Writing the code in the tex - 
editor 
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Formatting the font in the web page (face, size, color) 


4-a Format the font in the web by <font>...</font> 


To control the face, the size and the color of the font, the font is formatted by 
the <font> tag and this is an tag that has a group of properties. 


property 

function 

face 

Choose the font 

color 

Choose the font color 

size 

Choose the font size 


Notes: 

To change the font size, we have to notice that the browser identifies seven 
different font sizes that we choose by the property "size" the value is from 1 to 7. 



To create a web page with align right and contains the text " 
SjjkLij" with Andalus face, red color and size 6. 

With the help of the teacher, students do the following: 

- Write the code. 

- Save the text file with the .htm extension. 

- Open the file in the internet explorer. 
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Notes: 

- After using the close </font>, this finishes the effect of the tag on any text, 
written later and after that the text displays with the default shape. 

- In case, we don't use the <font> tag ,the color face displays on the web page with 
the default face. 
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Formatting the font in the web page (underlined/ bold/ italic) 


4-b formatting the font in the web page 


There are several Tags through which the font can be formatted. 
Some of them are shown in the following table: 



Activity (9) 


To modify the previous web page file, format the font by underlining the phrase " 

SjjJalaj A kdajj 4 1 j a % 

With the help of the teacher, students do the following: 


- Add the following code: 


<html> 

<head> 

</head> 


<U> SjjkLaj </u> 

- Save the text file with the .htm extension. 

- Open the file in the browser. 


<body dir="rtl"> 

<font face= M andalus M color="red" size="6"> 

<U> iulaij 4La» </u> 

\^</font> 

</body> 

</html> 
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With the help of the teacher, students do the following: 

- format the font in the web page to make the phrase " SjjkL»j 3iJaij kl±A*. jl*. j-i* 
"italic. 

- format the font in the web page to make the phrase " AiJajj kl± a*. 

"bold. 

Note that: 

- To format the font to be italic, we write the code: 

<j> Sjjlalaj AiJajj </i> 

- To format the font to be bold, we write the code: 

<b> Sjjlalaj ^iaa, J±aj*a </b> 
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^'Secondly : Formatting the background of the web page. 


1- Selecting the background color for the web page by 

the property bgcolor 


We use the property bgcolor that connects to the <body> tag to select the color of 
the web page background. 


X 


Activity (10) 


Cooperating with your classmates and with the help of the teacher: 
- Write the tag <body bgcolor="green"> 


<html> 

<head> 

</head> 

| <body bgcolor="green"~ 

</body> 

</html> 





Writing the code in the text 

formatting 

The following table contains some names of colors that can be used as a value to 
the property bgcolor 



Color 

Name 


Blue 


Brown 


Black 


Green 


Red 


White 


Yellow 


Purple 


Sky Blue 


formatting the web page background 


Second year Prep 


97 













Ministry of Education 


2- Adding image as a web page background by the 
property Background 


To add an image as a web page background, we use the property Background that 
relates to the <body> tag. 


Activity (11) 


Cooperating with your classmates and with the help of the teacher do the 
following: 

- Prepare an image file to be put as a web page background. 

- Save image inside the same folder that is saved in the web page. 

- Write the needed code to add image as a web page background"imagel.jpg" 
<body background="imagel.jpg" > 

- Save the text file by the .htm extensio 

- Open the file in the internet explorer. 

Noticing the image display as a web pa{ 

Background. 


n 

C ft fitey//C7Use«/*bw/0«ktop/vedio%20*nd1b20sound/<uU; 



1 . 

e 

<html> 

<head> 

</head> 


<body background="imagel. jpg" > 


</body> 

</html> 


Writing the code in the text 
editor 


The web page after 
executing the code 
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Dealing with images in the web pages: 


1- Insert image inside the web page by <img> tag. 



1- To insert image in the web page, we use <img> tag by selecting the following: 
The place where we save the image file and the name of the file and we do this by 
the property src to <img> tag. 


Activity (12) 


With the help of the teacher, students design a web page, its content as follows: 

- The text " " is red and underlined. 

- The school image displays under the text. 


<html> 

<head> 


<x\nr»yv«>fVvV0KTML\tA4lLoi.Ktm 





</head> 


<body > 

<font face="andalus" color-'red" size="6 M > 

< y > j jlaiioj ^Liii j juu i jio < j\} > 

</font> 

<br> 

<iig src="school* jpg"> 

</body> 


</html> 
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With the help of the teacher, students search on the internet for the types of 
image files extensions, which we can used in the web pages. 

Important Notes: 

- In the previous practice, the image file and the web page file must be in the same 
folder, so we write the image file name and its extension with the property src. 

- In case, there is a file image in another folder, we must write the complete path 
of the image file. 


Formatting the images in the web pages: 

The inserted image can be formatted 

by controlling the dimensions (height & width) and align it with the web 
page. 


1- Controlling the image dimension in the web page. 



We control the image dimension through the properties of the <img> tag as 
follows: 

- The property height. E.g. Height= "200" 

- The property width. E.g. Width= "300" 

We use the measurement unit "pixel" to measure the image dimensions. 
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Activity (13) 


With the help of the teacher, students insert the image and make its dimensions 
as follows: 

Width= 800 pixel 
Height= 450 pixel 

In the previous workshop, we write the following code: 

<img src="school.jpg" height="450" width="800"> 


I P’ C| 

<html> 


<head> 


* u * mi 



</head> 


<body > 

<font face="andalus" coloured" size=V> 

^Lo> ju*d 

</font> 

iki 

<img src="shool. jpg" hieght='H5tf' width="800"> 
</ body) 

</html> 
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Dealing with images in the web page: 


3- Align the image inside the web page 


We align the image through the property Align to the <img> tag and the property 
has the following values: 


Value 

function 

Right 

Align the image to the right 

Left 

Align the image to the left 

Middle 

Center the text in the middle of the image 

Bottom 

The text is positioned align down the image 

Top 

The text is positioned align top the image 



Cooperating with your classmates and with the help of the teacher modify 
the web page in the previous practice as follows: 

- formate the image to display the text with the image at the same line and 
the text aligns the middle of the image. 

- Save the text file with the .htm extension. 

- Open the file in the Internet Explorer. 


102 


Computer Information Technology And Communication 



Ministry of Education 



<html> 

<head> 

</head> 



<body > 




A 


<font face="andalus" color-'red" size="6 


</font> 

<br> 


<img src="shool. jpg" align="middle" > | 

</body> 

</html> 




"The text with the image at the same line and the text aligns the middle of the 
image" 



Cooperating with your classmates and with the help of the teacher do the 
following: 

- Align the image to right of the web page. 

- To align the image to position the text align the top of the image. 

Notes 

- To align the image to the right of the web page, the code is align="right". 

- To align the image to position the text to the top of the image, the code is 
align="right". 
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Dealing with the sound in the web page. 


Insert the sound as a background sound by <bgsound>tag 


We can insert the sound as a background to the web page to listen to when we 
download the web page by the browser. 

Important Notes: 

We must notice that the "Internet Explorer" is the only browser that supports the 
<bgsound> tag to insert the sound as a background to the web page. 

Using <bgsound> and the property src that follows, we insert the sound as a 
background to the web page. The property src to the tag takes the sound file 
name value and its extension (and this in case we save the sound file with the web 
page file in the same folder. Moreover we must write the complete file sound 
path). 



Creating a web page that when it is 
opened in the browser 

"Internet Explorer" the sound file 
"Egypt.MP3" is played. 

With the help of the teacher, students modify 
the code as it is shown in the picture. 

- Save the text file with the htm extension, i — 

- Open the web page file in the Internet 

Explorer. 




xhtml > 
<head> 
</head> 

<body > 



<bgsound src="egypt,l v lP3 ll > 


</body> 

</html> 


104 


Computer Information Technology And Communication 


Ministry of Education 


Dealing with the video inside the web page 


Insert Video in the web page by <embed> tag 

By using the <embed> tag, we insert the video inside the web page. We must notice 
that the tag supports the video file of the type (.swf - .avi - .mov). 

By using the <embed> tag and the property src that follows, we insert the 
video. The property value src takes the name of the video file and its extension(ln 
case, we save the video file with the web page file in the same folder and we must 
write the complete video file path). 


X 


Activity (16) 


With the help of the teacher, students create a web page which contains video 
that we can play inside it (internet.avi) 



<html> 

<head> 

</head> 


<bodv > 


<embed sre= M internet,avi"> 


</body> 

</html> 



The web page in the browser Hyperlink 
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Insert hyperlink in the web page by the <a>...</a>tag . 


Hyperlink is a hyper image or a hypertext, connected to a title and 
when we click it, we move to this title and it can be in the same page or 
in another one, in the same site or in another one. 


Practice 




Cooperating with your classmates and with the help of the teacher do the 
following: 

- Download the Ministry of Education web site. 

- Search inside the site pages for hyperlinks (hypertext or hyper image) 
Follow these hyper texts and images by clicking on them. - 

- Discuss with the students the different shapes of hyperlinks (in the same 
page, among the site pages, between site page and its hyperlink with another 
page in another site. 
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Hyperlink: 


To insert a hyperlink, we use href property to the <a> that selects its value; 
the needed title, that we want to move to, as follows 
<a href= "the needed title, we want to move to" > the text or image </a> 


1- Insert hyperlink text by the <a>...</a> tag . 


To insert a hyperlink text (hypertext) by href property to the <a> tag. 



Cooperating with your classmates and with the help of the teacher , create a 
web page that contains a hyperlink text "Ministry of Education). When we click on 
it, it moves to the main homepage of the Ministry. 

With the help of the teacher, students type the code of the web page as 
follows: 


<a href="http://www.moe.gov.eg" >Ministry of Education</a> 

1 

The address of the Ministry Appeal as 
site that we want to move to hypertext in the 

browser 


Hyperlink ^a href= > ...</a> 


Second year Prep 


107 


Ministry of Education 



The steps of creating and executing a hyperlink text 


1- Type the code in the text editor and save it. 

2- Open the web page in the browser. 

3- Click the hypertext in the web page. 

4- The Ministry of Education site is loaded. 


<html> 

<head> 

</head> 


1- Type the code in 


the text editor 



1 1 M Mai 1 

0 “ 

20/30 



3- Loading the 
Ministry site 


2- Open the web page in the 
browser and when we click the 
hypertext, the Ministry site is 
loaded 
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2- Insert a hyperlink to an image 


To make a hyper image, we must follow: 

- Display the image by <img> tag. 

- Put <img> inside <a>...</a> to make it a hyperlink 



Cooperating with your classmates and with the help of the teacher create a 
web page that contains a hyper image and when we click the image, we move to 
the web page "My school" 

- Modify the code in the previous web page to replace the text by the image 
"tools.jpg to change the hypertext to a hyper image as follows: 


<a href ="myschool.htm"ximg src="tools.jpg"x/a> 
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The steps of creating and executing a hyper image 

1- Write the code in one of the text editors and save it. 

2- Open the web page in the browser and when we click the hyper image, the web 
page "My school" is loaded. 

3- The web page "My school" is loaded. 



<html> 
<head> 
</head> 
<body > 


1- Write the code in one of the 
text editors and save it. 


<a href = myschool.htm > <img src= tools.jpg > </a> 
</body> 

</html> 



3- The web page "My school" is 

InarlpH 


2- Open the web page in the 
browser and when we click the 
hyper image, the web page "My 
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Remember 

Some HTML tags to create a web page as follows: 


Tag 

Function 

Associated 

Properties 

<html> 

Written at the beginning of the code to refer 
that the document is written by html. 


<head> 

A place where we write the web page title to 
the browser 


<body> 

A place where we write the content that will 
appear inside the web page 

Dir - bgcolor - 
background 

<title> 

Choose a title to the web page 


<br> 

Finishing the current line and start a new line 


<center> 

To add a text in the middle of the line 


&nbsp 

To insert a space between words in the 
browser 


<font> 

To control the font format 

Face-color- 

size 

<u> 

underline 


<b> 

bold 


<i> 

italic 


<img> 

To display the image in the web page 

src-height- 

width-align 
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tag 

function 

Associated 

properties 

<bgsound> 

To insert sound as a background to 
the web page 

src 

<embed> 

To add a sound or video to the web 

page 

src 

<a> 

To create a hyperlink 

href 

<input> 

To input data through the web page 
by different ways depending on the 
property value type 

type 

<form> 

Create a model in the web page 

action 
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Question: 1 Choose the suitable correct answer to the following 

phrases: 


1- HTML refers to the phrase 

a- HyperText Markup Library, 
b- Help Table Made Layout, 
c- HyperText Markup Language. 

2- The web page which uses HTML in its design, it is only considered a page. 


a- interactive 
b- Active 
c- static 

3- Using languages like JavaScript and PHP besides HTML in the design of the 
web page is to modify the page to 


a- interactive 
b- Homepage 
c- subpage 

4- To display a text on the web page, we write the text in the 


a- Head 
b- Title 
c- Body 



Second year Prep 


113 


Ministry of Education 



114 


Computer Information Technology And Communication 


Ministry of Education 


Question 2: Match 


(A) from (B): 


(A) 

(B) 

1- Web Site 

( ) a document with e-content that is published on 
the internet and is displayed by the browser. 

2- Homepage 

( ) display read-only information without the 
ability to do processing from guests to the content 

3- Web Page 

( ) a place on the internet that is consisted of a 
web page or more and is visited through specific 

titles 

4- Static Page 

( ) the first page on the web site and through it we 
easily move to the rest pages. 

5- Dynamic / 
Interactive page 

( ) the property to move to the site pages. 


( ) information page that displays an interactive 
content to the guests to interact and process it. 


Question 3 : Put ) or the correct sentence and ( X ) for the wrong one: 

1- HTML is used to create interactive web pages. ( ) 

2- JavaScript is used to modify the static page to interactive page. ( ) 

3- The tag that is written at the beginning of the code to refer that the 

document is written by html is <title>. ( ) 

4- to control the number of the spaces between words, we use the symbol 

&nbsp;. ( ) 

5- To add image to the web page, we use the <img> tag. ( ) 

Question: 4 Say the main code which is needed to create the HTML file? 


<img src= "school. png"> 

Although there are no errors in the previous code, the image doesn't display on 
the web page when loading it by the browser. Give a reason? 
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Question: 5 Explain what is meant by the following codes: 

<Title> My School </Title> 

<body bgcolor="green"> 

<lmg src = "school. png"> 

<font face="andalus"> 


<bgsound src="egypt.MP3"> 


Answer the questions using 

MS Word program from the fourth lesson answer file in the folder ( model answer 

and projects) 
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Projects 


118 


Computer Information Technology And Communication 


Ministry of Education 


The first project 

A practical project to design a web site 
"My school web site" 
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Objectives 


The general objective: 

To create a web site by a HTML language 
The specific objectives (practical) 

By the end of this lesson the student will be able to: 

• specify the number of the site pages from the Structural design of the 
website. 

• create the various page of the web using the HTML. 

• insert a hyperlink among the site pages. 


Creating the project "My school web site" 


My school 

Homepage About school Photo Album Vision 



Vision and message 


The school vision: 

Preparing a distinguished pupil able 
to 

Message: 

Developing the pupil's skills 



X 


Photo Album 








About school 


The date of school construction: 
School Address School phone.. 
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A Structural design to the project "My school web site" 


Creating my school web site 

From the Structural design of the web site, it is clear that it consists of five web 
pages as follows: 

1. The Home page "My school" is saved as Home.htm . 

2. The web page "About school" is saved as About.htm. 

3. The web page "Images Album" is saved as Photo.htm. 

4. The web page "Vision and message" is saved as Vision.htm. 

5. The web page "Contact us" is saved as Contact.htm. 

Creating and saving each web page will be as text file created by the HTML 
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Creating the "Homepage" 


Home.htm 


My school 

Homepage About school Photo Album Vision and message Contact us 



The home web page 
consists of: 

- The text The font 

(colour: red-type: Tahoma- 
size: 6) 

- Five text hyperlinks. 

- Image 

The code of the "Home" 
web page as follows: 



<head> 

</head> 

cbody bgcolor= skyblue dir= rtl > 

<center> 

<font face= tahoma color= red size='6 r >^l-yA4</font> 
<br> 

<font face= andalus color= purple size= 5’> 

<a href= liome.htm'>4^uu>11 iaj-a! 1 </a>&nbsp; &nbsp; 
<a href = about. ys. </a> &nbsp; &nbsp; 

<a h re f= photo.htm < a>&nbsp; &nbsp; 

<a href= photo.htm >i]L-y!.lj ijJjll </a>&nbsp; &nbsp; 
<a href= contact.htm >IL J J ua3l</a> 

<brxbr> 

<img src='school.png height= 450 width= 800 > 
</center> 

</body> 

</html> 
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Creating the web page "Photo Album" photo.htm 


The web page "About School" consists of: 

- The text "Photo Album" 

- The font (color: red - face: Tahoma- size: 6). 

- 3 images 

- Image hyperlink (on clicking, we return to the Homepage) 
The code of the web page "About School" as follows: 


Creating the web page "Vision and Mission"vision.htm 



<html> 

<head> 

< ti tl e /ti tl e > 

</head> 

<body bgcolor= skyblue > 

<center> 

<font face= tahoma color= red size= 6 > 

jj. wall *j3<br> 

<img src= students.jpg height= 400 width= 300 > 

<img src= teachers.jpg height= 400 wldth= 300 > 

<img src='yard.jpg height= 400 width='200 > <br> 

<a href = home.htm ximg src= back.jpg height= 100 width= 100 ></a> 
</center> 

</body> 

</html> 
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The web page "Vision and Mission" consists of: 

- The text "Vision and Mission" 

- The font (colour: red - face: Tahoma- size: 6). 

- The text "The school vision " 

The code of the web page "Vision and Mission" as follows: 


Vision and Mission \ 

The school vision: 

Preparing a distinguished pupil 

who is able to 

Message: 

Developing the pupil's skills 


<head> 

< ti tl e >^lda;A4</titl e > 

</head> 

<body bgcolor= skyblue > 

<center> 

<fomt face- tahoma color- red size- 6 > 

<U> </u> 

<brxbr> 

jjjua i_i JUa j]jt)...<br> 

5JLyylKbr> 

4-wijl . . <br> 

<brxbr> 

<a href-home.htm ximg src- back.jpg height-100 width-100 ></a> 
</center> 

</body> 

</html> 


Second year Prep 


125 




Ministry of Education 


The Second Project 


126 


Computer Information Technology And Communication 


Ministry of Education 


With the help of your teacher design, create and save the following: 


First: a text file using the text editor program that includes the following: 

The concept of the following: 

WebSite - WebPage - Homepage- Static Webpages - Interactive WebP 
ages 

- The steps to create audio file as follows: 

First: Preparation 
Second: Executing an audio file 
Third: Modifying the audio volume 
Fourth: Export audio to the file. 


- The steps of creating video 


- The steps of saving the video project- save project. 


- The steps of modifying the video shots through.... 


- The steps of exporting the video to a file with an available extension. 
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Second: Creating a presentation about creating web pages using HTML to include 

the following: 

• The next main rules to create web page using the HTML Tags. 

• The structure steps to create web page by HTML Tags. 

• Adding a content to the web page (text- image- video - hyperlink) 

• formatting the web page content. 

• Inserting a hyperlink inside the web page / among the site pages. 
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